<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
        <title>百度热搜</title>
        <style>
			* {
				margin: 0;
				padding: 0;
			}
			.hot {
				width: 350px;
				height: 700px;
			}
			div ul li {
				list-style: none;
			}
			ul {
				width: 400px;
			}
			.title {
				margin-right: 200px;
				margin-bottom: 300px;
			}
			div {
				display: inline;
			}
			.header div {
				display: inline;
			}
			.update {
				margin-left: 65px;
				display: block;
			}
			.hot-content {
				color: #333;
			}
			ul li .hot-count {
				float: right;
			}
			ul li {
				line-height: 40px;
			}
			li:nth-of-type(1) {
				padding: 0 20px 0 20px;
				background-repeat: no-repeat;
				background-position: 15px;
				background-image: url(image/top_1@1x-d1e660cf3b.png);
			}
			li:nth-of-type(2) {
				padding: 0 20px 0 20px;
				background-repeat: no-repeat;
				background-position: 15px;
				background-image: url(image/top_3@1x-676616abe1.png);
			}
			li:nth-of-type(3) {
				padding: 0 20px 0 20px;
				background-repeat: no-repeat;
				background-position: 15px;
				background-image: url(image/top_4@1x-8cffd4622f.png);
			}
			li:nth-of-type(4) {
				padding: 0 20px 0 20px;
			}
			li:nth-of-type(5) {
				padding: 0 20px 0 20px;
			}
			li:nth-of-type(6) {
				padding: 0 20px 0 20px;
			}
			li:nth-of-type(7) {
				padding: 0 20px 0 20px;
			}
			li:nth-of-type(8) {
				padding: 0 20px 0 20px;
			}
			li:nth-of-type(9) {
				padding: 0 20px 0 20px;
			}
			li:nth-of-type(10) {
				padding: 0 20px 0 20px;
			}
			a:link {
				color: black;
				list-style: none;
			}
        </style>
	</head>
	<body>
		<div class="hot">
			<div class="header">
				<div class="title"><b>百度热榜</b></div>
				<div class="update">
					<a href="#">换一换</a> <i class="icon"></i>
				</div>
			</div>
			<ul>
				<li>
					<div class="hot-item">1</div>
					<div class="hot-content">
						<a href="#">高校称将努力帮被顶替上学者就读</a>
					</div>
					<div class="hot-count">
						464万
					</div>
				</li>
				<li>
					<div class="hot-item">2</div>
					<div class="hot-content">
						<a href="#">北京三类人群必须全面核酸检测</a>
					</div>
					<div class="hot-count">
						449万
					</div>
				</li>
				<li>
					<div class="hot-item">3</div>
					<div class="hot-content">
						<a href="#">张铭恩现身胡冰卿小区</a>
					</div>
					<div class="hot-count">
						433万
					</div>
				</li>
				<li>
					<div class="hot-item">4</div>
					<div class="hot-content">
						<a href="#">世卫称病毒已在全球层面稳固传播	</a>
					</div>
					<div class="hot-count">
						418万
					</div>
				</li>
				<li>
					<div class="hot-item">5</div>
					<div class="hot-content">
						<a href="#">31省区市新增确诊22例</a>
					</div>
					<div class="hot-count">
						403万
					</div>
				</li>
				<li>
					<div class="hot-item">6</div>
					<div class="hot-content">
						<a href="#">端午小长假热门景点出炉</a>
					</div>
					<div class="hot-count">
						362万
					</div>
				</li>
				<li>
					<div class="hot-item">7</div>
					<div class="hot-content">
						<a href="#">鄂牌车主抗疫去世发帖者承认瞎编</a>
					</div>
					<div class="hot-count">
						350万
					</div>
				</li>
				<li>
					<div class="hot-item">8</div>
					<div class="hot-content">
						<a href="#">林云回应演技夸张争议</a>
					</div>
					<div class="hot-count">
						337万
					</div>
				</li>
				<li>
					<div class="hot-item">9</div>
					<div class="hot-content">
						<a href="#">郑智出任广州恒大助理教练</a>
					</div>
					<div class="hot-count">
						325万
					</div>
				</li>
				<li>
					<div class="hot-item">10</div>
					<div class="hot-content">
						<a href="#">养老金中央调剂超7000亿</a>
					</div>
					<div class="hot-count">
						314万
					</div>
				</li>
			</ul>
		</div>
	</body>
</html>